<div class="fsh-rightPanel">
    <div class="layui-anim layui-anim-upbit">
        <div id="list_form" class="layui-form-item wx-search">
            <div class="layui-inline">
                <input id="_schoolCode" type="text"  class="layui-input"  name="schoolCode" readonly/>
            </div>
            <div class="layui-inline">
                <input id="_schoolName" name="schoolName1"  class="layui-input" placeholder="请选择学校"  autocomplete="off" readonly/>
            </div>
            <div class="layui-inline">
                <input type="text" name="squad_name" placeholder="请输入班级名称" autocomplete="off" class="layui-input">
            </div>
            <button class="layui-btn btn-primary" id="search">搜索</button>
            <button class="layui-btn btn-primary" id="clear">清除</button>
            <button class="layui-btn btn-primary" id="role_add">新建班级</button>
        </div>
        <table id="list_table" class="layui-hide" lay-filter="mainList"></table>
    </div>
</div>

<script type="text/html" id="toolbarDemo">
    <!--  table 上方操作按钮  -->
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
        <button class="layui-btn layui-btn-sm" lay-event="del">删除</button>
    </div>
</script>
<script type="text/html" id="btnBar">
<!--  table 数据操作按钮  -->
    <a href="javascript:;" class="font-primary" lay-event="user">成员管理</a>
    <a href="javascript:;" class="font-primary" lay-event="timetable">课程表</a>
    <a href="javascript:;" class="font-primary" lay-event="update">修改</a>
    <a href="javascript:;" class="font-primary" lay-event="del">删除</a>
</script>

<script>
    layui.use(['layer', 'table'], function () {
        var layer = layui.layer;
        var table = layui.table;
        var tableObj = table.render({
            elem: '#list_table'
            , url: context + '/api/squad/list?school='+ (userInfo.school_id||""),
            //开启头部工具栏，并为其绑定左侧模板，
            toolbar: '#toolbarDemo'
            , request: {
                limitName: 'pageSize' //每页数据量的参数名，默认：limit
            }
            //, defaultToolbar: ['filter', 'exports', 'print', {}]
            , align: 'center'
            , cols: [[ //表头
                {type: 'checkbox', fixed: 'left'},
                {field: 'squad_name', title: '班级名称', align: 'center'},
                {field: 'squad_num', title: '班级人数', align: 'center'},
                {field: 'squadCode', title: '班级代码', align: 'center'},
                {field: 'schoolCode', title: '学校代码', align: 'center'},
                { title: '专业', align: 'center', templet: function (d) {
                        return getSpeciality()[d.speciality_id];
                    }},
                {field: 'startSchool', title: '开学时间', align: 'center'},
                {field: 'graduation', title: '毕业时间', align: 'center'},
                {field: 'status', title: '是否毕业', align: 'center', templet: function (d) {return d.status == 1 ? '是' : '否';}},
                {title: '操作', width: 340, unresize: true, align: 'center', toolbar: "#btnBar"}
            ]]
            , page: true
        });
        // 检索
        $("#search").click(function () {
            reloadTable(tableObj);
        });
        // 清除搜索条件
        $("#clear").click(function () {
            $("#list_form input").val('');
        });
        // 添加
        $("#role_add").click(function () {
            var schoolCode = $("#_schoolCode").val();
            if(!schoolCode){
                showAlert('请先选择学校');
                return;
            }
            showDialog({
                title: '新建班级'
                , template: 'add'
                , saveUrl: context + '/api/squad/add'
                , tableObj: tableObj
                , type: 'post'
                , dataType: 'json'
                , htmlData: {schoolCode: schoolCode, schoolName: $("#_schoolName").val()}
            })
        });

        //表格内部操作按钮监听
        table.on('tool(mainList)', function (obj) { //注：tool是工具条事件名，mainList是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值
            if (layEvent === 'update') {//编辑
                showDialog({
                    title: '编辑 - ' + data.squad_name
                    , template: 'add'
                    , saveUrl: context + '/api/squad/update'
                    , tableObj: tableObj
                    , htmlData: data
                    , type: "patch"
                    , dataType: 'json'
                })
            }else if (layEvent === 'del') {//删除
                confirmDel(context + '/api/squad/del/' + data.squad_id, tableObj);
            }else if (layEvent === 'user') {//成员列表
                showDialog({
                    title: '成员管理 - ' + data.squad_name
                    , template: 'squadUser'
                    , htmlData: data
                    , width: 1400
                    , height: 600
                })
            }else if (layEvent === 'timetable') {
                showDialog({
                    title: '课程表管理 - ' + data.squad_name
                    , template: context + '/views/school/timetable/timetable.html'
                    , htmlData: data
                    , width: 1400
                    , height: 600
                })
            }
        });
        selectSchool();
        // var tableSelect = layui.tableSelect;
        // tableSelect.render({
        //     elem: '#_schoolName,#_schoolCode',	//定义输入框input对象 必填
        //     checkedKey: 'id', //表格的唯一建值，非常重要，影响到选中状态 必填
        //     searchKey: 'schoolName',	//搜索输入框的name值 默认keyword
        //     searchPlaceholder: '学校名称',	//搜索输入框的提示文字 默认关键词搜索
        //     table: {	//定义表格参数，与LAYUI的TABLE模块一致，只是无需再定义表格elem
        //         url: context + '/api/eduSchoolAll/list',
        //         cols:  [[
        //             // { type: 'checkbox' },//多选
        //             { type: 'radio' },//单选
        //             { field: 'schoolCode', title: '代码', width: 120 },
        //             { field: 'schoolName', title: '名称', width: 300 },
        //             { field: 'location', title: '地区', width: 100 }
        //         ]]
        //     },
        //     done: function (elem, data) {
        //         //选择完后的回调，包含2个返回值 elem:返回之前input对象；data:表格返回的选中的数据 []
        //         //拿到data[]后 就按照业务需求做想做的事情啦~比如加个隐藏域放ID...
        //         console.log(data);
        //         data = data.data[0];
        //         $("#_schoolCode").val(data.schoolCode);
        //         $("#_schoolName").val(data.schoolName);
        //     }
        // })

    });
</script>
